// 商品列表模板
import draggable from 'vuedraggable'
import { saveMicroPage,viewPageByCategory } from '@/api/shoppingMall/feature'
export default {
  name: 'GoodsFeature',
  components:{
    draggable
  },
  data() {
    return {
      isSaving: false, // 是否正在保存
      id:'',
      dialogVisible: false,
      currentChoose: '1',
      image: {
        '1': {
          main: require('../../../../assets/micro-page/categoryType_1_1.png'),
          active: require('../../../../assets/micro-page/categoryType_1_2.png'),
          desc: '通用行业，适用于用户按照商品二级分组进行筛选'
        }
      },
      itemTep:
        {
          title: '导航名称',
          // 关联内容
          contentType: '1',
          topAd: {
            imageLink: '1',
            h5: '',
            appId: '',
            topAdImage: '',
            pagePath: ''
          },
          bottomAd: {
            imageLink: '1',
            h5: '',
            appId: '',
            topAdImage: '',
            pagePath: ''
          }

        },
      currentShowIndex: 0,
      settingConfig: {
        category:13,
        styleType: '1',
        adType: '1',
        imageSize: '1',
        classImage: '1',
        showType: '1',
        cartType: '1',
        title: '分类',
        showGoodsSaleNum: '1',
        showCart: '1',
        description: '',
        items: [
          {
            title: '导航名称',
            // 关联内容
            contentType: '1',
            topAd: {
              imageLink: '1',
              h5: '',
              appId: '',
              topAdImage: '',
              pagePath: ''
            },
            bottomAd: {
              imageLink: '1',
              h5: '',
              appId: '',
              topAdImage: '',
              pagePath: ''
            }

          }
        ]
      }
    }
  },
  mounted () {
    this.getInfo()
  },
  methods: {
    getInfo(){
      viewPageByCategory({ id: 13 }).then(res => {
        if(res !== null){
          this.id = res.id
          this.settingConfig = res.moduleList[0].dataField
        }

      })
    },
    handleSave() {
      this.settingConfig.styleType = this.currentChoose;
      this.dialogVisible = false;
    },
    // 保存
    save(){
      this.isSaving = true
      const moduleList = {
        id: this.id,
        operType: 2,
        moduleList: [{
            type: "config",
            dataField: this.settingConfig
        }]
      }
      saveMicroPage(moduleList).then(res => {
        this.isSaving = false
        this.$message.success('发布成功')
        this.getInfo()
      })
    },
  }
}
